<template>
  <view>
    <!-- <view class="input-item">
       <text class="label">产品类型： </text>
        <select v-model="kilo">
		  <option value="">请选择缺陷类型</option>
		     <option value="3517">3517</option>
		     <option value="3519">3519</option>
        </select>
    </view> -->
   <view class="input-item">
      <text class="label">产品类型：</text>
      <input v-model="type" placeholder="请输入产品类型"></input>
    </view>
	  
    <!-- <view class="input-item">
      <text class="label">产生源：</text>
       <select v-model="stick">
         <option value="线体">线体</option>
         <option value="人工复判">人工复判</option>
		 <option value="一检">一检</option>
		 <option value="GP12">GP12</option>
		 <option value="其他">其他</option>
       </select>
    </view> -->
	<view class="input-item">
		 <text class="label">产生源:</text>
	    <picker mode="selector" :range="stickOptions" @change="onStickChange">
	      <view class="picker">
	              <text v-if="!selectedStickOption">请选择：</text>
	              {{ selectedStickOption }}
	            </view>
	    </picker>
	  </view>
	<view class="input-item">
	  <text class="label">数量：</text>
	  <input v-model="number" placeholder="请输入数量"></input>
	</view>
	<view class="input-item">
	  <text class="label">重量：</text>
	  <input v-model="weight" placeholder="请输入重量"></input>
	</view>
    <view class="input-item">
      <text class="label">二维码：</text>
      <input v-model="qrcode" placeholder="扫描二维码"></input>
      <button @click="scanQRCode">扫码</button>
    </view>

	 <view>
	    <button @click="takePhoto">拍照</button>
	  </view>
	<view class="input-item">
	  <text class="label">提交人：</text>
	  <input v-model="subperson" placeholder="请输入提交人"></input>
	</view>
    <button @click="submitForm">提交</button>
	<text class="label">提示信息：{{message}}</text>
  </view>
</template>

<script>

import { pathToBase64 } from '../../../image-tools.js'

export default {
  data() {
    return {
      kilo: [{value:3517},{value:3519}],
	  kiloList:[{key:"3517",name:"3517"},{key:"3519",name:"3519"}],
	   // 定义固定的下拉框选项
	  kiloOptions: ['3517', '3519'],
	  // 记录当前选择的固定选项
	  selectedKiloOption: '',
	  stickOptions: ['铝棒', '铝管','辅材'],
	  selectedStickOption: '',
      stick: '',
      remark: '',
      qrcode: '',
	  qrcode2:'',
	  number:'',
	  weight:'',
	  type:'',
	  subperson:'',
	  message:'',
	  message2:'',
    }
  },
  mounted(){
	  
	  //加载上一次的提交人
	//let value = wx.getStorageSync('subperson')
	//this.subperson = value
  },
  methods: {
	onKiloChange(e) {
	    // 下拉框选项改变时触发的事件处理函数
	    this.selectedKiloOption = this.kiloOptions[e.detail.value];
	},
	onStickChange(e) {
		 // 下拉框选项改变时触发的事件处理函数
		 this.selectedStickOption = this.stickOptions[e.detail.value];
	},
    scanQRCode() {
	  wx.scanCode({
		  onlyFromCamera:true, //默认只能相机扫码，不能相册
		  success:(res)=>{
			  this.qrcode = res.result
		  }
	  })
    },
	scanQRCode2() {
	  wx.scanCode({
		  onlyFromCamera:true, //默认只能相机扫码，不能相册
		  success:(res)=>{
			  this.qrcode2 = res.result
		  }
	  })
	},
    submitForm() {
        // 用到了vue-cli自带的跨域
		// axios.get('http://localhost:8080/students').then(
		let that = this;
		
		let source = this.selectedStickOption
		let number = this.number
		let weight = this.weight
		let qrcode = this.qrcode
		let type = this.type
		let subperson = this.subperson
		
		// if(kilo == null ||kilo == "" || stick == null || stick == "" || remark == null || remark == ""){
		// 	uni.showToast({
		// 	  title: '请把信息补充完整再提交',
		// 	  icon: 'none',
		// 	});
		// 	return;
		// }
		
		// if( (qrcode == '' || qrcode == null) && (qrcode2 == '' || qrcode2 == null)){
		// 	uni.showToast({
		// 	  title: '两个二维码必填一个',
		// 	  icon: 'none',
		// 	});
		// 	return;
		// }
		
		wx.request({
		  url: 'http://192.168.10.68:6006/submit',
		  method: 'GET', // 请求方法，POST、GET等
		  data: { source,number,weight,qrcode,type,subperson }, // 请求参数，如果是POST则为请求体
		  header: {
			'content-type': 'application/json' ,// 设置请求的header
			'Access-Control-Allow-Origin': '*', // 允许所有域名访问，也可以设置为指定的域名
		  },
		  success(res) {
			  that.source = '';
			  that.number = '';
			  that.weight = '';
			  that.qrcode = '';
			  that.type = '';
			  that.subperson = '';
			  that.selectedKiloOption = '';
			  that.selectedStickOption = '';
			  that.message = '';
			  uni.showToast({
			    title: '提交成功',
			    icon: 'success',
			  });
			 
			console.log(res.data); // 在这里获取到服务端返回的数据
			//将当前提交人写入缓存
			//wx.setStorageSync("subperson",subperson)
			//this.setData({ result: res.data }); // 更新页面数据
		  },
		  fail(err) {
			  uni.showToast({
			    title: '失败了',
			    icon: 'none',
			  });
			  this.remark = err
			console.error('请求失败', err);
			
		  }
		});
    },
	
	takePhoto() {
		let that = this;
	  //console.log("11111");
	  uni.chooseImage({
	    count: 1,
	    sizeType: ['original', 'compressed'],
	    sourceType: ['album', 'camera'],
	    success: async (res) => {
	    const tempFilePath = res.tempFilePaths[0];
		console.log("2222",tempFilePath);
	
	    let imgBase64 = ''
	    await pathToBase64(tempFilePath).then(base64=>{
			imgBase64 = base64
		})
		
		console.log("4444",imgBase64);

		uni.request({
		  url: 'http://192.168.210.109:6006/api/base64',
		  method: 'POST',
		  data: {
		    base64Data: imgBase64,
			subperson: this.subperson
		  },
		  header: {
		    'content-type': 'application/json',
			'Access-Control-Allow-Origin': '*', // 允许所有域名访问，也可以设置为指定的域名
		  },
		  success: (uploadRes) => {
		    console.log(uploadRes.data);
		    uni.showToast({
		      title: '照片上传成功',
		      icon: 'success',
		    });
			that.message = "";
		  },
		  fail: (error) => {
			  this.stick = error;
			  this.message = error;
		    console.log(error);
			
		    uni.showToast({
		      title: '照片上传失败',
		      icon: 'none',
		    });
		  },
		});
	
	    },
	    fail: (err) => {
	      console.error('选择图片失败：', err);
	    },
	  });
	}
	
	
	
	
	
	
	
  }
}
</script>

<style>
.input-item {
  display: flex;
  align-items: center;
  height: 50px;
}
.label {
  width: 80px;
}
input {
  flex: 1;
  margin-right: 10px;
}
button {
  margin-top: 10px;
}
</style>